<template>
    <!-- {{ config.name }} edit -->
    <el-form ref="form" :model="form" label-width="80px">
        {% for  item in config.props %}
            <el-form-item label="{{ item.label }}">
                {% if item.type == 'boolean' %}
                    <el-switch v-model="form.{{ item.prop }}"></el-switch>
                    {% else %}
                        <el-input v-model="form.{{ item.prop }}"></el-input>
                {% endif %}

            </el-form-item>
        {% endfor %}

        <el-button @click="handleCancel">取 消</el-button>
        <el-button
                type="primary"
                @click="onSubmit"
        >确 定</el-button>

    </el-form>
</template>

<script>

    export default {
        name: '',

        props: {

        },

        components: {  },

        data() {
            return {
                form: {
                    id: null,
                {% for  item in config.props %}
                    {{ item.prop }}: '{{ item.default }}',
                {% endfor %}
                },

                rules: {
                {% for  item in config.props %}
                    {{ item.prop }}: [
                        { required: true, message: '{{ item.label }}不能为空', trigger: ['blur', 'change'] },
                    ],
                {% endfor %}
                },
            };
        },

        computed: {},

        methods: {
            async getData() {
                const res = await this.$Http.getDataFunction({
                    id: this.form.id,
                });

                if(res.code == 0){
                    for (let key of Object.keys(this.form)) {
                        this.form[key] = res.data[key];
                    }
                } else{
                    this.$message.error(res.msg);
                }

            },

            onSubmit() {
                this.$refs.form.validate((valid) => {
                    if (valid) {
                        this.confirmSubmit();
                    }
                });
            },

            async confirmSubmit() {
                const res = await this.$Http.submitFunction(this.form);

                if (res.code == 0) {
                    this.$message.success('操作成功');
                    this.$emit('success');
                } else {
                    this.$message.error(res.msg);
                }

            },

            handleCancel() {
                console.log('handleCancel');
            },
        },

        created() {
            this.form.id = this.$route.query.id;

            if(this.form.id){
                this.getData();
            }
        },
    };
</script>

<style lang="scss" scoped>

</style>
